<template>
   <div id="box">
       <header>
           <span class="one" @click="fanhui">
              <img src="../assets/img/fanhui2.png" class="fanhui">
            </span>
            <span class="center">一购分类</span>
            <span class="two">
              <img src="../assets/img/gengduo.png" class="gengduo">
            </span>
       </header>
       <main>
            <input type="text" placeholder="搜索商品"/>
       </main> 
       <content>
       <router-link to="yigouhuodong">
            <ul>
              <li><img src="../assets/img/quanbufenlei.png" ><span>全部商品</span></li>
            </ul>
          </router-link>
       </content>  
       <article><p>分类浏览</p></article>  
       <section>
         <ul>
          <router-link to="shoujishuma">
           <li><img src="../assets/img/shoujishuma.png" ><span>手机数码</span></li>
         </router-link>
         <a>
           <li><img src="../assets/img/diannaobangong.png" ><span>电脑办公</span></li>
         </a>
         <a>
           <li><img src="../assets/img/jiayongdianqi.png" ><span>家用电器</span></li>
         </a>
           <li><img src="../assets/img/jiajujiafang.png" ><span>家居家纺</span></li>
           <li><img src="../assets/img/shipin.png" ><span>食品饮料</span></li>
           <li><img src="../assets/img/chaoliu.png" ><span>潮流新品</span></li>
           <li><img src="../assets/img/xunichongzhi.png" ><span>虚拟充值</span></li>
           <li><img src="../assets/img/qita.png" ><span>其他商品</span></li>
         </ul>
       </section>         
   </div>
</template>

<script>
export default {
  name: 'yigoufenlei',
 methods:{
  fanhui(){
    this.$router.go(-1)
  }
 }
}

</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped lang="less">
    @import '.././assets/less/yigoufenlei.less';
    @import '.././assets/css/reset.css';
</style>